define(function(require, exports, module) {

  // var Backbone = require('backbone');
  var $ = require('jquery');
  var _ = require('underscore');
  // var jsonview = require('jsonview');
  var tmpl = require('text!../tmpl.html');

  var t = require('frontend')
  var Query = require('./wac')

  function main() {
    var $app = $('<div id="app">');
    $('#main').html($app);

    $app.append(tmpl);

    var QUERY = 4;
    var T = t;
    function DropSelectMenu(o) {
      function _id(id) {
        return document.getElementById(id);
      }
      
      var id = o.id,
        dom = _id(id),
        dropdown = document.createElement("ul");

      if (!dom)
        return;
      dropdown.id = id + "_dropmenu";
      dropdown.className = "aa-drop-select";
      dropdown.style.display = "none";
      dropdown.style.position = "absolute";

      resetPosition();

      T.addEvent(dom, "focus", function(e) {
        dropdown.style.display = "";
        resetPosition();
      })

      if (dom.parentNode)
        dom.parentNode.appendChild(dropdown);
      else
        document.body.appendChild(dropdown);

      function resetPosition() {
        dropdown.style.left = dom.offsetLeft + "px";
        dropdown.style.top = dom.offsetTop + dom.offsetHeight + "px";
        dropdown.style.width = dom.offsetWidth + "px";
      }

      return {
        getDropMenuDom: function() {
          return dropdown;
        },
        show: function() {
          dropdown.style.display = "";
        },
        hide: function() {
          dropdown.style.display = "none";
        },
        catchEvent: function(fcall) {
          T.addEvent(dropdown, "click", function(e) {
            var eve = e || window.event;
            var target = eve.target || eve.srcElement;
            if (eve.stopPropagation)
              eve.stopPropagation();
            else if (eve.cancellBubble)
              eve.cancellBubble();
            if (fcall)
              fcall(target);
          })
        }
      }
    }

    function BuildLiFragment(aselect, istart) {
      var dfrag = document.createDocumentFragment(),
        li = null;

      var j = istart || 0;
      T.eachArray(aselect, function(val, i) {
        li = document.createElement("li");
        li.innerHTML = val;
        li.className = "index-" + (i + j);
        dfrag.appendChild(li);
      });
      return dfrag;
    }

    function GetSelectItem(scgipath, orequestSet, sparam, sid, fcall) {
      var istart = orequestSet._start || 0,
        isize = orequestSet._size || 50,
        aselect = [];

      var dd = DropSelectMenu({id:sid});

      var dropdown = dd.getDropMenuDom();

      Query(scgipath, orequestSet, function(data) {
        T.eachArray(data.rows, function(oset) {
          aselect.push(oset[sparam]);
        });
        
        var dfrag = BuildLiFragment(aselect, istart);
        if (data.filternum > (istart + data.rows.length))
        {
          liExtra = document.createElement("li");
          liExtra.innerHTML = "+显示更多+";
          liExtra.className = "show-more";
          dfrag.appendChild(liExtra);
        }

        dropdown.appendChild(dfrag);
        istart = istart + aselect.length;
        dd.catchEvent(function(dom) {
          var sclassName = dom.className;
          if (sclassName === "show-more")
          {
            orequestSet._istart = istart;
            Query(scgipath, orequestSet, function(data) {
              var atmp = [];
              T.eachArray(data.rows, function(oset) {
                atmp.push(oset[sparam]);
              });

              aselect = aselect.concat(atmp);
              dropdown.insertBefore(BuildLiFragment(atmp, istart), liExtra);

              if (data.filternum <= (istart + data.rows.length))
                dropdown.removeChild(liExtra);
              istart = istart + atmp.length;
            });
          }
          else if (/index-/.test(sclassName))
          {
            var index = parseInt(sclassName.replace(/index-/, ""));
            document.getElementById(sid).value = aselect[index];
            dd.hide();
          }
        });
      });
    }
    Test();
    function Test() {
      GetSelectItem("v/dazzle/select-load-more/select.json", {_op:QUERY}, "name", "radio_conf");
    }

    $('#load').click(Test)
  }

  return main;
})
